export class RegisterPage {
    constructor(onRegister) {
        this.onRegister = onRegister;
        this.container = null;
    }

    render() {
        if (!this.container) {
            this.container = document.createElement('div');
            this.container.className = 'register-container';
            this.container.innerHTML = `
                <div class="register-box">
                    <h2>注册</h2>
                    <form id="register-form">
                        <div class="form-group">
                            <input type="text" class="username" placeholder="用户名" required>
                        </div>
                        <div class="form-group">
                            <input type="password" class="password" placeholder="密码" required>
                        </div>
                        <div class="form-group">
                            <input type="password" class="confirm-password" placeholder="确认密码" required>
                        </div>
                        <button type="submit">注册</button>
                    </form>
                    <div class="login-link">
                        <a href="#/login">已有账号？立即登录</a>
                    </div>
                </div>
            `;

            const form = this.container.querySelector('#register-form');
            form.addEventListener('submit', (e) => {
                e.preventDefault();
                const username = this.container.querySelector('.username').value;
                const password = this.container.querySelector('.password').value;
                const confirmPassword = this.container.querySelector('.confirm-password').value;
                
                if (password !== confirmPassword) {
                    alert('两次输入的密码不一致');
                    return;
                }
                
                this.onRegister(username, password);
            });
        }
        return this.container;
    }
} 